<template>
  <div class="mardiv">
    <el-form ref="form" :model="form" :rules="rules" label-width="110px">
      <el-form-item label="标题" prop="title">
        <el-input :disabled="title === '知识详情'" v-model="form.title" placeholder="请输入知识标题"></el-input>
      </el-form-item>
      <el-form-item label="副标题" prop="subtitle">
        <el-input :disabled="title === '知识详情'" type="textarea" :rows="4" placeholder="请输入副标题" v-model="form.subtitle">
        </el-input>
      </el-form-item>
      <el-form-item label="资料分类" prop="knowledgeType">
        <el-select :disabled="title === '知识详情'" v-model="form.knowledgeType" placeholder="请选择资料分类" clearable>
          <el-option v-for="(dict, index) in dict.type.knowledge_type" :key="index" :label="dict.label"
            :value="dict.value">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="内容" prop="remark">
        <editor v-model="form.remark" :min-height="250" :readOnly="title === '知识详情'" />
      </el-form-item>
      <el-form-item label="附件" prop="file">
        <FileUpload v-if="!(title === '知识详情')" :isFile="true" v-model="form.file" :limit="1" @input="inputfile">
        </FileUpload>
        <el-link v-else :href="form.file" target="_blank" type="primary">{{
          this.form.fileName ||
            '附件资料'
        }}</el-link>
      </el-form-item>
    </el-form>

    <el-divider></el-divider>
    <br>
    <div align="center" slot="footer" class="dialog-footer" v-if="!(title === '知识详情')">
      <el-button type="primary" @click="submitForm">确 定</el-button>
      <el-button @click="clear">取 消</el-button>
    </div>
  </div>
</template>

<script>
import { createdbase, updatedbase, getbasechildren } from "@/api/knowledge/knowledgebase.js";
// import Upload from '@/components/upload/index.vue'
export default {
  dicts: ['knowledge_type'],
  props: ['title', 'rowObj'],
  components: {
    // Upload
  },
  data () {
    return {
      ValueList: [],
      userList: [],
      realTime: undefined,
      form: {
        "title": undefined,     //标题
        "subtitle": undefined,    //副标题
        "knowledgeType": undefined,    //知识分类-关联字典
        "file": undefined,  //附件
        "fileName": undefined,  //附件名称
        "remark": undefined //内容
      },
      typeList: [],
      rules: {
        title: { required: true, message: '必填', trigger: ['blur', 'change'] },
        knowledgeType: { required: true, message: '必填', trigger: ['blur', 'change'] },
        subtitle: { required: true, message: '必填', trigger: ['blur', 'change'] },
        file: { required: true, message: '必填', trigger: ['blur', 'change'] },
        remark: { required: true, message: '必填', trigger: ['blur', 'change'] },
      }
    }
  },
  computed: {
  },
  created () {
    this.getlist()
  },
  methods: {
    inputfile (url) {
      if (url) {
        this.form.fileName = url[0].name
        this.form.file = url[0].url
      } else {
        this.form.fileName = ''
        this.form.file = ''
      }
    },
    async getlist () {
      if (this.title === '修改知识' || this.title === '知识详情') {//修改进入
        let { data: data } = await getbasechildren(this.rowObj.id);
        const Base64 = require('js-base64').Base64
        this.form = { ...data, remark: Base64.decode(data.remark) }

      }
    },
    //提交
    submitForm () {
      this.$refs['form'].validate((valid) => {
        if (valid) {
          let data = Object.assign({}, this.form)
          const Base64 = require('js-base64').Base64
          data.remark = Base64.encode(data.remark)
          if (this.title === '修改知识') {//修改
            let params = data
            updatedbase(params).then(res => {
              if (res.code === 200) {
                this.$message.success(res.msg)
                this.clear()

              }
            })
          } else {//新增
            let params = data
            createdbase(params).then(res => {
              if (res.code === 200) {
                this.$message.success(res.msg)
                this.clear()
              }
            })
          }
        }
      });
    },
    clear () {
      this.$emit('quit')
    }
  }
}
</script>

<style lang="scss" scoped>
// .mardiv {
//   // width: 60%;
//   // margin: 0 auto;
// }
</style>